﻿@model IEnumerable<JewererBasic.Models.HistoryComponent>


@{
    ViewBag.Title = "Component History";

    var gd = new WebGrid(
            Model,
            canPage: true,
            rowsPerPage: 10,
            selectionFieldName: "selectedRow",
            ajaxUpdateContainerId: "gridContent"
        );
    gd.Pager(WebGridPagerModes.NextPrevious);
}

<h2>Component History</h2>

@using (Html.BeginForm()) {

    <fieldset>
        <div>
        <a href="/Component/Index">
            <input type="button" value="BACK" />
        </a>
    </div>
    
    <table>
        <tr>
            <td>
                <fieldset>
                    <legend>HISTORY</legend>
                    <table>
                        <tr>
                            <td style="text-align: center">
                                <strong>Item</strong>
                            </td>
                            <td style="text-align: center">
                                <strong>From</strong>
                            </td>
                            <td style="text-align: center">
                                <strong>To</strong>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                @Html.TextBox("txtIdComponent", (string)ViewBag.Id, new { placeholder="Component Id"})
                            </td>
                            <td>
                                <input type="date" name="makedDateFrom" value="@ViewBag.MakedDateFrom" />
                            </td>
                            <td>
                                <input type="date" name="makedDateTo" value="@ViewBag.MakedDateTo" />
                            </td>
                            <td>
                                <input type="submit" name="submit" value="HISTORY" />
                            </td>
                            <td>
                                <input type="submit" name="submit" value="CLEAR" />
                            </td>
                        </tr>
                        <tr>
                            <td colspan="4">
                                <table>
                                    <tr>
                                        <td>
                                            @Html.CheckBox("ckboxImport", (bool)ViewBag.ImportBool, new { value="Import"})
                                        </td>
                                        <td>
                                            <label for="ckboxImport" style="font-size:large">Import</label>
                                        </td>
                                        <td>
                                            @Html.CheckBox("ckboxExportToStaff", (bool)ViewBag.ExportToStaffBool, new { value="Export To Staff"})
                                        </td>
                                        <td>
                                            <label for="ckboxExportToStaff" style="font-size:large">Export To Staff</label>
                                        </td>
                                        <td>
                                            @Html.CheckBox("ckboxExportToBag", (bool)ViewBag.ExportToBagBool, new { value="Export To Bag"})
                                        </td>
                                        <td>
                                            <label for="ckboxExportToBag" style="font-size:large">Export To Bag</label>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>

                    <div>
            @gd.GetHtml(
                tableStyle: "table",
                headerStyle: "head",
                rowStyle: "row",
                alternatingRowStyle: "altRow",
                selectedRowStyle: "selectRow",
                columns: gd.Columns(
                gd.Column(header: "Component", format: @<div style="width: 200px; text-align: center;"><span>@item.IdComponent</span></div>),
                gd.Column(header: "Creater", format: @<div style="width: 130px; text-align: center;"><span>@item.IdCreater</span></div>),
                gd.Column(header: "Receiver", format: @<div style="width: 130px; text-align: center;"><span>@item.Reciever</span></div>),
                gd.Column(header: "Received Bag", format: @<div style="width: 130px; text-align: center;"><span>@item.ReceivedBag</span></div>),
                gd.Column(header: "Time", format: @<div style="width: 100px; text-align: center;"><span>@(((DateTime)item.Time).ToString("MM/dd/yyyy"))</span></div>),
                gd.Column(header: "Type", format: @<div style="width: 100px; text-align: center;"><span>@item.Type</span></div>),
                gd.Column(header: "Weight", format: @<div style="width: 100px; text-align: center;"><span>@item.Weight</span></div>),
                gd.Column(header: "Paper Id", format: @<div style="width: 100px; text-align: center;"><span>@item.IdBill | 
                    @Html.ActionLink("Print", item.Type == "Import" ? "ImportedComponent" : item.Type == "ExportBag" ? "ExportedComponentToBag" : "ExportedComponentToStaff", "Report", new { id = item.IdBill }, new { })</span></div>)
            ))
        </div>
                </fieldset>
            </td>
        </tr>
    </table>

    </fieldset>
}

@section Scripts {
    
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <script src="@Url.Content("~/Scripts/json2.min.js")" type="text/javascript"></script>
    <script type="text/javascript">

        $("#txtIdComponent").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: '/Component/GetComponents',
                    data: { query: request.term },
                    dataType: 'json',
                    type: 'GET',
                    success: function (data) {
                        response($.map(data, function (item) {
                            return {
                                label: item,
                                value: item
                            }
                        }));
                    },
                })
            },
            messages: {
                noResults: '',
                results: function () { }
            },
            select: function (event, ui) {
                $("#txtIdComponent").val(ui.item.label);
                return false;
            },
            minLength: 1
        });
    </script>
}